<html>
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="text/css" http-equiv="Content-Style-Type">
<title>中心主题</title>
</head>
<body>
<h1 align="center" class="root">
<a name="308hut1kvcgpb3m4p364huf0c8">中心主题</a>
</h1>
<div align="center" class="globalOverview">
<img src="jq-%E9%80%89%E6%8B%A9%E5%99%A8_files/images/%E4%B8%AD%E5%BF%83%E4%B8%BB%E9%A2%98.jpg"></div>
<h2 class="topic">
<a name="6u20qqh9qc3ikq3fe0h73ajaf8">01-selector</a>
</h2>
<h3 class="topic">
<a name="3k5b2m0spbtlhcuk2ui7fudh05">&nbsp;概念</a>
</h3>
<h3 class="topic">
<a name="2m665vihc7dveadln1b7oldef0">&nbsp;&nbsp;JQuery是一个兼容多浏览器的javascript类库，核心理念是write less,do more(写得更少,做得更多)。是一个快速的简洁的javascript框架，可以简化查询DOM对象、处理事件、制作动画、处理Ajax交互过程。在2006年1月由美国人John Resig在纽约的barcamp发布。</a>
</h3>
<h3 class="topic">
<a name="4glmec5tvrnapmhvo148gvofta">&nbsp;优势</a>
</h3>
<h3 class="topic">
<a name="281tsc1raqkp8n3i95526hajiv">&nbsp;&nbsp;1）强大的选择器（利用CSS的优势）</a>
</h3>
<h3 class="topic">
<a name="23lh8aeh9kite5b97mimfmq47v">&nbsp;&nbsp;2）出色的DOM操作</a>
</h3>
<h3 class="topic">
<a name="5ei7faoj1v4geka8if4qjbi775">&nbsp;&nbsp;3）可靠的事件处理机制</a>
</h3>
<h3 class="topic">
<a name="0r5qprud2mi58rdmoomuhdt82i">&nbsp;&nbsp;4）完善的ajax</a>
</h3>
<h3 class="topic">
<a name="692ugb60vpc8l46qdilhf2v0bl">&nbsp;&nbsp;5）出色的浏览器兼容</a>
</h3>
<h3 class="topic">
<a name="18ef6gfjsbmatt55t0ab2ffkoh">&nbsp;&nbsp;6）链式操作</a>
</h3>
<h3 class="topic">
<a name="4rnnolga64pehvcemsndmeiecq">&nbsp;&nbsp;7）丰富的插件并支持扩展</a>
</h3>
<h3 class="topic">
<a name="3v03qq1l7p5p1p8ga05pqjqu0j">&nbsp;&nbsp;8）完善的文档</a>
</h3>
<h3 class="topic">
<a name="3bm1iq3gaejfdshs5hsqc9vcm0">&nbsp;&nbsp;9）开源</a>
</h3>
<h3 class="topic">
<a name="5pnj2kudv2fqn0iqen51t3ds64">&nbsp;使用</a>
</h3>
<h3 class="topic">
<a name="25icdacj43baf8lmeekd05qu5l">&nbsp;&nbsp;jQuery：jquery对象名称</a>
</h3>
<h3 class="topic">
<a name="3k3i9qv7cmh5uu61crdtke4i3c">&nbsp;&nbsp;jQuery(document).ready()</a>
</h3>
<h3 class="topic">
<a name="3ouf128eh3mqff0090bfbtvc1r">&nbsp;&nbsp;&nbsp;1)此方法传入一个匿名函数;</a>
</h3>
<h3 class="topic">
<a name="6hboh0rohq9ghvihul58mo0e21">&nbsp;&nbsp;&nbsp;2)比window.onload先执行;</a>
</h3>
<h3 class="topic">
<a name="0mplr0grphnsch7380cdg4bbuv">&nbsp;&nbsp;&nbsp;3)简写方式:$(function(){});</a>
</h3>
<h3 class="topic">
<a name="7kr6vo54qnkqhsbtsugu4a9foj">&nbsp;&nbsp;jQuery == $（$是jQuery的别名）</a>
</h3>
<h3 class="topic">
<a name="3n3u0t9h1crrkur72ogrrgk01d">&nbsp;&nbsp;jQuery方法</a>
</h3>
<h3 class="topic">
<a name="48as0m0t1s6qje8phkhq6a0pkk">&nbsp;&nbsp;&nbsp;1)css() : 改变style属性</a>
</h3>
<h3 class="topic">
<a name="5mi6dgt1gq0fve1ik0jd45n1j1">&nbsp;&nbsp;&nbsp;2)val() : 获得匹配元素的当前值</a>
</h3>
<h3 class="topic">
<a name="1og73hvv1idu19ls67oogjgk8n">&nbsp;&nbsp;&nbsp;3)html():元素的html内容</a>
</h3>
<h3 class="topic">
<a name="1i4t545t30ri8j0c7c54bar14g">&nbsp;&nbsp;&nbsp;可取值/赋值</a>
</h3>
<p class="summary">(<a href="#5mi6dgt1gq0fve1ik0jd45n1j1">2)val() : 获得匹配元素的当前值</a>, <a href="#1og73hvv1idu19ls67oogjgk8n">3)html():元素的html内容</a>)</p>
<h3 class="topic">
<a name="0f0h4vnh3h3q9o9vmq3arb3an9">&nbsp;&nbsp;链式操作（利用在方法执行完后返回jquery对象的原理）</a>
</h3>
<h3 class="topic">
<a name="5pr9m92n1qfhm07p1eej0vtqqt">&nbsp;选择器</a>
</h3>
<h3 class="topic">
<a name="5j84v237i44pbmja4nuu8p70k1">&nbsp;&nbsp;标签选择器$("div")</a>
</h3>
<h3 class="topic">
<a name="3odolvi9n5b2cuv67174vrt7kd">&nbsp;&nbsp;ID选择器$("#save")</a>
</h3>
<h3 class="topic">
<a name="29qcgn77t1g0hsv6808qj89ls9">&nbsp;&nbsp;类选择器$(".class")</a>
</h3>
<h3 class="topic">
<a name="1gnu4kuufaq1de5ro4igqtffbq">&nbsp;&nbsp;元素选择器</a>
</h3>
<h3 class="topic">
<a name="21f86nrm1r409ol030582prrr1">&nbsp;&nbsp;属性选择器$(&ldquo;[type=text]&rdquo;)</a>
</h3>
<h3 class="topic">
<a name="12cbvrfjupm3md3ar5fkmuqhlg">&nbsp;&nbsp;&nbsp;//返回 含有id属性的div</a>
</h3>
<h3 class="topic">
<a name="6ep9j4fjcr9i8t496nidagjcq7">&nbsp;&nbsp;&nbsp;$("div[id]")</a>
</h3>
<h3 class="topic">
<a name="4lkvpgulrrhnrler7iga4uq3ft">&nbsp;&nbsp;&nbsp;//返回name属性等于newsletter</a>
</h3>
<h3 class="topic">
<a name="3682ailtupiftc7kekrp7oi6ls">&nbsp;&nbsp;&nbsp;$("input[name='newsletter']");</a>
</h3>
<h3 class="topic">
<a name="2geto9at5i0q1j47llpvtfa12u">&nbsp;&nbsp;&nbsp;&nbsp;</a>
</h3>
<h3 class="topic">
<a name="26caracgh997ptsjba0t03svuu">&nbsp;&nbsp;&nbsp;//返回name属性不等于newsletter</a>
</h3>
<h3 class="topic">
<a name="127midif1gijrs9uqpcs58mala">&nbsp;&nbsp;&nbsp;$("input[name!='newsletter']");</a>
</h3>
<h3 class="topic">
<a name="7cus0tn41hbal8corf7e5sj98r">&nbsp;&nbsp;&nbsp;&nbsp;</a>
</h3>
<h3 class="topic">
<a name="2rsk269ufl8n4p67b63m9ht60g">&nbsp;&nbsp;&nbsp;//返回name属性包含man的标签</a>
</h3>
<h3 class="topic">
<a name="4r9n83ocpqgm789ue1r8irn7ke">&nbsp;&nbsp;&nbsp;$("input[name*='man']")</a>
</h3>
<h3 class="topic">
<a name="2gt4in7b5749kcj6jvn53ecqie">&nbsp;&nbsp;&nbsp;//找到所有含有 id 属性，并且它的 name 属性是包含 man 的</a>
</h3>
<h3 class="topic">
<a name="6qh1q7ktp47bpo9eovn8bl1liq">&nbsp;&nbsp;&nbsp;$("input[id][name*='man']")</a>
</h3>
<h3 class="topic">
<a name="6qde9hh1de1kvb8eb9kcj050dv">&nbsp;&nbsp;复合选择器 $("div,span,p.myClass");</a>
</h3>
<h3 class="topic">
<a name="7l1hegk5hmm30pckispc083r8n">&nbsp;&nbsp;表单选择器</a>
</h3>
<h3 class="topic">
<a name="6ncl28ar1bbvakfc4jcc5f6h0i">&nbsp;&nbsp;&nbsp;:input 		//匹配所有 input, textarea, select 和 button 元素</a>
</h3>
<h3 class="topic">
<a name="3rtsls7gljvacqqbfm4e860dh1">&nbsp;&nbsp;&nbsp;:text 		//匹配所有的单行文本框</a>
</h3>
<h3 class="topic">
<a name="58s9qrov5piuv9gt367sf620bk">&nbsp;&nbsp;&nbsp;:password 	//匹配所有密码框</a>
</h3>
<h3 class="topic">
<a name="5ufisvr7ib4qri7mibn47clr9r">&nbsp;&nbsp;&nbsp;:radio 		//匹配所有单选按钮</a>
</h3>
<h3 class="topic">
<a name="5i9g0gn0g0r9n607d279h34ts0">&nbsp;&nbsp;&nbsp;:checkbox 	//匹配所有复选按钮</a>
</h3>
<h3 class="topic">
<a name="2mpgp2thafl6037r7j1v9lv34g">&nbsp;&nbsp;&nbsp;:submit 		//匹配所有提交按钮</a>
</h3>
<h3 class="topic">
<a name="6tp5vp30gn2ge7skjuq4lf3bos">&nbsp;&nbsp;&nbsp;:reset 		//匹配所有重置按钮</a>
</h3>
<h3 class="topic">
<a name="4ucn39bgm0m3p7stvph76tji34">&nbsp;&nbsp;&nbsp;:button 		//匹配所有按钮</a>
</h3>
<h3 class="topic">
<a name="0ol36eecln0a7n8jb5q6e84hla">&nbsp;&nbsp;&nbsp;:hidden 		//匹配所有不可见元素，或者type为hidden的元素</a>
</h3>
</body>
</html>
